<template>
  <i :class="className" :style="styles" v-on="$listeners"></i>
</template>

<script>
import { computed, defineComponent } from 'vue-demi'
export default defineComponent ({
    name:'el-icon',
    props:{
        name:{
            // 提供 .el-icon-name 中的name值，即可
            type:String,
            default:""
        },
        size:{
            // icon的字体大小，单位: px
            type:Number,
            default:12
        }
    },
    setup(props){
        const className = computed(()=>`el-icon-${props.name}`)
        const styles = computed(()=>({
            fontSize:props.size + 'px'
        }))
        return {
            className,
            styles
        }
    }
})
</script>

<style>
@import "./icon.css";
</style>